<template>
  <div class="h-full">
    <SearchContainer @search="getData" @reset="() => formRef.resetFields()">
      <a-form ref="formRef" class="form-style-flex" :model="formState">
        <a-form-item name="pyjm" label="" class="w-80">
          <a-input v-model:value="formState.pyjm" placeholder="名称" />
        </a-form-item>
      </a-form>
    </SearchContainer>
    <a-card class="mt-2">
      <div class="flex">
        <a-button class="mb-2" type="primary" @click="onClickAdd()"> 新增 </a-button>
      </div>
      <BaseTable fill :loading="loading" column-code="000484" :data-source="tableData" bordered :pagination="pagination">
        <template #bodyCell="{ column, index, record }">
          <template v-if="column.dataIndex === 'xh'">
            {{ index + 1 }}
          </template>
          <template v-if="column.dataIndex === 'categroyName'">
            <PopoverTable :config="detailConfig" :params="{ categroyCode: record?.categroyCode }" :width="600">
              <template #bodyCell="{ column: popColumn, record: popRecord }">
                <template v-if="popColumn.dataIndex === 'mc'">
                  <MedicineInfo :value="{ mc: popRecord.mc, gg: popRecord.gg, cj: popRecord.cj }" />
                </template>
              </template>
              {{ record.categroyName }}
            </PopoverTable>
          </template>
          <template v-if="column.dataIndex === 'action'">
            <a-space>
              <a-button type="link" size="small" @click="onClickCompare(record)">对照</a-button>
              <a-button type="link" size="small" @click="onClickAdd(record)">修改</a-button>
              <BaseButton confirm-text="确认删除?" type="text" danger size="small" @click="onClickDelete(record)"> 删除 </BaseButton>
            </a-space>
          </template>
        </template>
      </BaseTable>
    </a-card>
    <Edit v-model:open="editOpen" :row-data="rowData" @success="getData" />
  </div>
</template>

<script setup>
import { ref } from 'vue'
import { message } from 'ant-design-vue'
import { useRouter } from 'vue-router'
import SearchContainer from '@/components/SearchContainer'
import BaseTable from '@/components/BaseTable'
import { post } from '@/utils/request'
import Edit from './components/Edit'

const router = useRouter()

const editOpen = ref(false)
const formRef = ref(null)
const formState = ref({})
const rowData = ref({})

const { loading, tableData, pagination, getData } = useTable({
  url: '/lis/InstrumentType/getLisCategroyList',
  params: formState.value,
  immediate: true
})

const detailConfig = ref({
  url: '/lis/InstrumentType/getLisCategroyItemList',
  columnCode: '000485',
  rowKey: 'jhmxdh',
  formatResult: (data) => {
    return data.map((item, index) => ({
      ...item,
      NO: index + 1
    }))
  }
})

// 添加
const onClickAdd = (row) => {
  rowData.value = { ...row }
  editOpen.value = true
}

// 对照
const onClickCompare = (row) => {
  router.push({
    path: '/workstation-inspect/maintenance/categories-compare',
    query: {
      id: row.categroyCode
    }
  })
}

// 删除
const onClickDelete = async (row) => {
  const { code, msg } = await post('/lis/InstrumentType/delLisCategroy', row)
  if (code !== 0) return message.error(msg)
  message.success('删除成功')
  getData()
}
</script>
